<template>
  <div>
    <el-row style="margin-bottom: 5px;" class="dynamicBreadCrumb">
      <el-col :span="12">
        <div class="grid-content bg-purple">
          <el-breadcrumb separator-class="el-icon-arrow-right">
            <el-breadcrumb-item>
              <i class="el-icon-ship" style="color: red;"></i>
            </el-breadcrumb-item>
            <el-breadcrumb-item>重要记录</el-breadcrumb-item>
            <el-breadcrumb-item>会议记录</el-breadcrumb-item>
          </el-breadcrumb>
        </div>
      </el-col>
      <el-col :span="12">
        <div class="grid-content bg-purple-light" style="float:right">
          <el-button type="primary" icon="el-icon-search" size="mini">帮助</el-button>
          <el-button icon="el-icon-refresh" size="mini">返回</el-button>
        </div>
      </el-col>
    </el-row>

    <el-tabs type="border-card" :style="{'min-height' : TabMinHeight,'overflow':'auto'}" class="dynamicContext">
      <el-tab-pane>
        <span slot="label">
          <i class="el-icon-reading"></i> 基本信息
        </span>

        <div class="div-height">
          我是神经病 - one 我快乐着呢。
          <!--          <genera></genera>-->
        </div>
      </el-tab-pane>
      <el-tab-pane>
        <span slot="label">
          <i class="el-icon-more"></i> 其他补充信息
        </span>

        <div class="div-height">
          我是神经病 - 如果是主从结构，则这里展示的是从表的列表数据，有多少个从表，就有多少个标签！！
          <!-- <ideas></ideas> -->
        </div>
      </el-tab-pane>
      <el-tab-pane>
        <span slot="label">
          <i class="el-icon-paperclip"></i> 附件信息
        </span>

        <div class="div-height">
          我是神经病 - 附件列表信息，只能预览，删除，不能新增
          <!--          <organization></organization>-->
        </div>
      </el-tab-pane>
      <el-tab-pane>
        <span slot="label">
          <i class="el-icon-reading"></i> 检阅信息
          <el-badge :value="102" class="item" type="warning"></el-badge>
        </span>

        <div class="div-height">
          我是神经病 - 管理员检阅信息，仅仅可以查看
          <!--          <org-warning></org-warning>-->
        </div>
      </el-tab-pane>
      <el-tab-pane>
        <span slot="label">
          <i class="el-icon-edit-outline"></i> 签发信息
          <el-badge :value="3" class="item" type="primary"></el-badge>
        </span>

        <div class="div-height">
          我是神经病 - 业务签发列表 可以浏览历史的签发记录
          <!--            <central-group-learn></central-group-learn>-->
        </div>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
export default {
  name: 'spsMaster',
  data() {
    return {
      TabMinHeight: document.body.clientHeight - 100 + 'px',
    }
  },
  mounted() {
    window.addEventListener('resize', () => {
      this.TabMinHeight = document.body.clientHeight - 100 + 'px'
    })
  },
  methods: {},
}
</script>

<style scoped>
.div-height {
  min-height: 100px;
}
</style>
